<style>
    #Main{height:100%;}
    /*header 10001*/
    .header.el-row {
        width: 100%;
        margin-bottom: 0;
        color: #fff;
        line-height: 42px;
        height: 42px;
    }
    .header.el-row .el-col {border-radius: 0;position:relative;}
    .header.el-row .el-col .bg-primary {background:#212121;text-align: center;font-size: 16px;border-radius:0;}
    .header.el-row .el-col .login_message{position:absolute;right:20px;top:0;height:42px;line-height: 42px;}
    .header.el-row .el-col .login_message .user-photo{width:30px;height:30px;display:inline-block;text-align:center;vertical-align:middle;overflow:hidden;border-radius:50%;}
    .header.el-row .el-col .login_message .user-photo img{width:100%;}
    .header.el-row .el-col .login_message #exit{margin-left:8px;cursor:pointer;}
    .header.el-row .el-col .grid-content {display:inline-block;height:42px;text-align:left;font-size:22px;}

    /*left height:624px;*/
    .main{height:calc(100% - 72px);height:-webkit-calc(100% - 72px);position: relative;display: block;}
    .main-left{width:200px;background:#3d3d3d;height:100%;overflow-x:hidden;overflow-y:auto;  float: left;}
    /*
    .main-left{position:absolute;top:41px;left:0;z-index:1999;width:200px;background:#3d3d3d;overflow-x:hidden;overflow-y:auto;}*/
    /*.main-left ul li{border-bottom:1px solid #5c5c5c !important;}*/

    .main-left .el-menu{background:#3d3d3d;font-size:12px;}
    .main-left .elmenu .el-menu-item{height:40px;line-height:40px;color:#ffffff !important;font-weight: bold;}
    .main-left .el-menu .el-menu-item:hover{background:#303030;}
    .main-left .el-menu-item.is-active{background:#e02222;}
    .main-left .el-menu-item.is-active:hover{background:#e02222;}
    .main-left .el-menu-item, .el-submenu__title{height:35px;line-height:35px;color:#fff !important;font-weight: bold;font-size:12px;border-bottom: 1px solid #5c5c5c;text-align:left;}
    .main-left .el-submenu .el-menu-item:hover, .el-submenu__title:hover{background:#303030;}
    .main-left .el-submenu .el-menu-item.is-active:hover{background:#e02222;}
    .main-left .el-submenu .el-menu{background:#3d3d3d;}
    .el-submenu.is-active .el-submenu__title{border-bottom: 1px solid #5c5c5c;}
    /*right  height:624px;*/
    .main-right{padding:10px 1% 0px; height: 100%;text-align: left;width: -moz-calc(100% - 200px);width: -webkit-calc(100% - 200px);width: calc(100% - 200px); float: left;overflow-y:auto;box-sizing: border-box;-webkit-box-sizing: border-box;}
    /*
    .main-right{padding:10px 1% 0px;margin-left:200px;margin-top:42px;overflow-y:auto;}*/
    .main-right .view{}

    /* footer */
    .footer{padding: 0 20px;width: 100%;height: 30px;line-height: 30px;font-size: 12px;background: #3d3d3d;color: #999;box-sizing: border-box;position:relative;}
    .footer .footer-inner {
        display: inline-block;
    }
    .footer .footer-tools {
        display: inline-block;
    }
    .footer .footer-tools .nav-lang{cursor:pointer;display: inline-block;height: 100%;}
    .footer .footer-tools .nav-lang.active{color:#fff;}

    /* 菜单标志 */
    .el-badge__content.is-fixed{width: 19px;height: 18px;line-height: 18px;border-radius: 50%;border: none;top: 12px;right: 0px;padding: 0;font-weight: 500;background: #007ACC;}
    .more .el-badge__content.is-fixed{line-height:13px;}
    .top{background: #212121;text-align: left}
    .top_img{    height: 42px;  padding-left: 10px;display: block;  float: left;}
    .top_title{vertical-align: top;  font-size: 22px;  margin-left: 20px;  font-size: 20px;  line-height: 45px;}

</style>
<template>
    <div id="Main">
        <!-- 头部导航 -->
        <el-row class="header">
            <el-col :span="24">
                <div class="top">
                    <img class="top_img" src="../images/logo(2).png" alt="">
                    <span class="top_title">Service Supply Chain Management</span>
                    <div class="login_message">
                        <div class="user-photo">
                            <img src="../images/user-photo.png" alt="用户头像">
                        </div>
                        <span>{{username}}</span> <i class="iconfont">&#xe61e;</i>
                        <i id="exit" class="iconfont" @click="Exit">&#xe600;</i>
                    </div>
                </div>
            </el-col>
        </el-row>
        <main class="main clearfix">
            <!-- 左侧导航 -->
            <div class="main-left fleft">
                <!--不带icon 菜单-->
                <el-menu :default-active="defaultActive" :unique-opened="true" class="el-menu-vertical-demo"  v-bind:router="true">
                    <el-submenu index="1" v-show="powerFlag.ROLE_security_systemSetting">
                        <template slot="title">
                            <i class="iconfont">&#xe621;</i>
                            <span v-text="nowLangue.systemCongig"></span>
                            <!--系统配置-->
                        </template>
                        <el-menu-item  index="managementUnit" v-show="powerFlag.ROLE_security_managementUnit">
                            <i class="iconfont">&#xe6ab;</i>
                            <!--管理单元-->
                            <span v-text="nowLangue.manageUnit"></span>
                        </el-menu-item>
                        <el-submenu index="1-3" v-show="powerFlag.ROLE_security_security_userSetting">
                            <template slot="title">
                                <i class="iconfont">&#xe7e5;</i>
                                <!--用户配置-->
                                <span v-text="nowLangue.userSetting"></span>
                            </template>
                            <el-menu-item index="localStaff" v-show="powerFlag.ROLE_security_personnelOfDepartment">
                                <i class="iconfont">&#xe656;</i>
                                <!--本部人员-->
                                <span v-text="nowLangue.personnelOfDepartment"></span>
                            </el-menu-item>
                            <el-menu-item index="businessPartner" v-show="powerFlag.ROLE_security_businessCooperationPersonnel">
                                <i class="iconfont">&#xe62a;</i>
                                <!--业务合作人员-->
                                <span v-text="nowLangue.businessCooperationPersonnel"></span>
                            </el-menu-item>
                            <el-menu-item index="servicePersonnel" v-show="powerFlag.ROLE_security_serviceSystemPersonnel">
                                <i class="iconfont">&#xe605;</i>
                                <!--服务体系人员-->
                                <span v-text="nowLangue.serviceSystemPersonnel"></span>
                            </el-menu-item>
                            <el-menu-item index="serviceLegalPerson" v-show="powerFlag.ROLE_security_serviceSystemPersonnel">
                                <i class="iconfont">&#xe605;</i>
                                <!--服务体系人员-->
                                <span v-text="nowLangue.serviceLegalPerson"></span>
                            </el-menu-item>

                            <el-menu-item index="gaoguoxun" v-show="powerFlag.ROLE_security_serviceSystemPersonnel">
                                <i class="iconfont">&#xe605;</i>
                                <!--高国勋-->
                                <span v-text="nowLangue.gaoguoxun"></span>
                            </el-menu-item>

                            <el-menu-item index="gaoxiaolong" v-show="powerFlag.ROLE_security_serviceSystemPersonnel">
                                <i class="iconfont">&#xe605;</i>
                                <!--服务体系人员-->
                                <span v-text="nowLangue.gaoxiaolong"></span>
                            </el-menu-item>
                            <el-menu-item index="maguangyi" v-show="powerFlag.ROLE_security_serviceSystemPersonnel">
                                <i class="iconfont">&#xe605;</i>
                                <!--服务体系人员-->
                                <span v-text="nowLangue.maguangyi"></span>
                            </el-menu-item>
                        </el-submenu>
                        <el-submenu index="1-4" v-show="powerFlag.ROLE_security_authorityManagement">
                            <template slot="title">
                                <i class="iconfont">&#xe65c;</i>
                                <!--权限管理-->
                                <span v-text="nowLangue.authorityManagement"></span>
                            </template>
                            <el-menu-item index="roleManagement" v-show="powerFlag.ROLE_security_roleManagement">
                                <i class="iconfont">&#xe657;</i>
                                <!--角色管理-->
                                <span v-text="nowLangue.roleManagement"></span>
                            </el-menu-item>
                            <el-menu-item index="personnelEmpowerment" v-show="powerFlag.ROLE_security_personnelEmpowerment">
                                <i class="iconfont">&#xe67c;</i>
                                <!--人员赋权-->
                                <span v-text="nowLangue.personnelEmpowerment"></span>
                            </el-menu-item>
                            <el-menu-item index="roleQuery" v-show="powerFlag.ROLE_security_roleQuery">
                                <i class="iconfont">&#xea64;</i>
                                <!--角色查询-->
                                <span v-text="nowLangue.roleQuery"></span>
                            </el-menu-item>
                        </el-submenu>
                        <el-menu-item  index="Delegation"  v-show="powerFlag.ROLE_security_security_delegationAuthorization" >
                            <i class="iconfont">&#xe659;</i>
                            <!--委托授权-->
                            <span v-text="nowLangue.delegationAuthorization"></span>
                        </el-menu-item>
                    </el-submenu>
                    <el-submenu index="2" v-show="powerFlag.ROLE_security_basicData">
                        <template slot="title">
                            <i class="iconfont">&#xe650;</i>
                           <!-- 基础数据-->
                            <span v-text="nowLangue.basicData"></span>
                        </template>
                        <el-menu-item  index="spareFile" v-show="powerFlag.ROLE_security_maretialArchives">
                            <i class="iconfont">&#xe66e;</i>
                            <!--备件档案-->
                            <span v-text="nowLangue.maretialArchives"></span>
                        </el-menu-item>
                        <el-menu-item  index="SpareCostPrice" v-show="powerFlag.ROLE_security_maretialPrice">
                            <i class="iconfont">&#xe612;</i>
                            <!--备件成本价-->
                            <span v-text="nowLangue.maretialPrice"></span>
                        </el-menu-item>
                        <el-menu-item  index="TaxCodeTaxRate" v-show="powerFlag.ROLE_security_taxRate">
                            <i class="iconfont">&#xe60b;</i>
                            <!--税码税率设置-->
                            <span v-text="nowLangue.taxRateSetting"></span>
                        </el-menu-item>
                        <el-menu-item  index="CorporateFactory" v-show="powerFlag.ROLE_security_legalPersonFactory">
                            <i class="iconfont">&#xe604;</i>
                            <!--法人工厂设置-->
                            <span v-text="nowLangue.legalPersonFactory"></span>
                        </el-menu-item>

                        <el-menu-item  index="FaZhi">
                            <i class="iconfont">&#xe60e;</i>
                            <!--阈值设置-->
                            <span v-text="nowLangue.fazhi2"></span>
                        </el-menu-item>

                        <el-menu-item  index="BeiJian">
                            <i class="iconfont">&#xe60e;</i>
                            <!--备件小类设置-->
                            <span v-text="nowLangue.beijianConfig"></span>
                        </el-menu-item>
                        <el-menu-item  index="SpareSubclass">
                            <i class="iconfont">&#xe60e;</i>
                            <!--备件小类设置-->
                            <span v-text="nowLangue.spareSmallConfig"></span>
                        </el-menu-item>

                        <el-menu-item  index="PlanCategory">
                            <i class="iconfont">&#xe60a;</i>
                            <!--计划大类设置-->
                            <span v-text="nowLangue.planCategoryConfig"></span>
                        </el-menu-item>
                        <el-menu-item  index="SpareFile">
                            <i class="iconfont">&#xe60a;</i>
                            <!--备件数量阀值设置-->
                            <span v-text="nowLangue.fazhi"></span>
                        </el-menu-item>
                        <el-menu-item  index="ProductLine">
                            <i class="iconfont">&#xe6bb;</i>
                            <!--产品线设置-->
                            <span v-text="nowLangue.productLineSetting"></span>
                        </el-menu-item>
                        <el-menu-item  index="ProductLineStaffing">
                            <i class="iconfont">&#xe66b;</i>
                            <!--产品线人员设置-->
                            <span v-text="nowLangue.productLineStaffing"></span>
                        </el-menu-item>
                    </el-submenu>
                    <el-submenu index="3" v-show="powerFlag.ROLE_security_inquiryAndQuote">
                        <template slot="title">
                            <i class="iconfont">&#xe67e;</i>
                            <!--询价报价-->
                            <span v-text="nowLangue.inquiryAndQuote"></span>
                        </template>
                        <el-menu-item  index="InquirySheet" v-show="powerFlag.ROLE_security_inquiryList">
                            <el-badge value="..." class="item more">
                                <i class="iconfont">&#xe61c;</i>
                               <!-- 询价清单-->
                                <span v-text="nowLangue.inquiryList"></span>
                            </el-badge>
                        </el-menu-item>
                        <el-menu-item  index="QuotationList" v-show="powerFlag.ROLE_security_quotationList">
                            <i class="iconfont">&#xe8e5;</i>
                            <!--报价列表-->
                            <span v-text="nowLangue.quotationList"></span>
                        </el-menu-item>
                        <el-menu-item  index="QuotationSheet" v-show="powerFlag.ROLE_security_quotationSheet">
                            <i class="iconfont">&#xe606;</i>
                            <!--报价清单-->
                            <span v-text="nowLangue.quotationSheet"></span>
                        </el-menu-item>
                        <el-menu-item   index="QuotationApproval" v-show="powerFlag.ROLE_security_quotationConfirmation">
                            <el-badge :value="8" class="item">
                                <i class="iconfont">&#xe699;</i>
                                <!--报价确认-->
                                <span v-text="nowLangue.quotationConfirmation"></span>
                            </el-badge>
                        </el-menu-item>
                    </el-submenu>
                    <el-submenu index="4" v-show="powerFlag.ROLE_security_procurementPlan">
                        <template slot="title">
                            <i class="iconfont">&#xe601;</i>
                            <!--备件计划-->
                            <span v-text="nowLangue.procurementPlan"></span>
                        </template>
                        <el-menu-item  index="demandForecast" >
                            <i class="iconfont">&#xe6b6;</i>
                            <!--需求预测-->
                            <span v-text="nowLangue.demandForecast"></span>
                        </el-menu-item>
                        <el-menu-item  index="SparePlan" v-show="powerFlag.ROLE_security_materialPlan">
                            <el-badge :value="6" class="item">
                                <i class="iconfont">&#xe601;</i>
                                <!--备件计划-->
                                <span v-text="nowLangue.materialPlan"></span>
                            </el-badge>
                        </el-menu-item>
                        <el-menu-item  index="PlanSummary" v-show="powerFlag.ROLE_security_planSummary">
                            <i class="iconfont">&#xe670;</i>
                            <!--计划汇总-->
                            <span v-text="nowLangue.planSummary"></span>
                        </el-menu-item>
                        <el-menu-item  index="PlannedDistribution" v-show="powerFlag.ROLE_security_planDistribution">
                            <i class="iconfont">&#xe614;</i>
                            <!--计划分配-->
                            <span v-text="nowLangue.planDistribution"></span>
                        </el-menu-item>
                        <el-menu-item  index="ReplacementConfirmation" v-show="powerFlag.ROLE_security_replaceConfirmation">
                            <i class="iconfont">&#xe638;</i>
                            <!--替换确认-->
                            <span v-text="nowLangue.replaceConfirmation"></span>
                        </el-menu-item>
                        <el-menu-item  index="PlanTracking" v-show="powerFlag.ROLE_security_planExecutionTracking">
                            <i class="iconfont">&#xe607;</i>
                           <!-- 执行跟踪-->
                            <span v-text="nowLangue.planExecutionTracking"></span>
                        </el-menu-item>
                    </el-submenu>
                    <el-submenu index="5" v-show="powerFlag.ROLE_security_procurementManagement">
                        <template slot="title">
                            <i class="iconfont">&#xe616;</i>
                           <!-- 采购管理-->
                            <span v-text="nowLangue.procurementManagement"></span>
                        </template>
                        <el-menu-item  index="SpareOrder" v-show="powerFlag.ROLE_security_materialOrder">
                            <i class="iconfont">&#xe6bc;</i>
                            <!--备件订单-->
                            <span v-text="nowLangue.materialOrder"></span>
                        </el-menu-item>
                        <el-menu-item  index="POTracking" v-show="powerFlag.ROLE_security_poTracking">
                            <i class="iconfont">&#xe607;</i>
                            <!--订单跟踪-->
                            <span v-text="nowLangue.poTracking"></span>
                        </el-menu-item>
                        <el-menu-item  index="NoticeDeliverySheet" v-show="powerFlag.ROLE_security_notificationDelivery">
                            <i class="iconfont">&#xe6ea;</i>
                           <!-- 通知送货-->
                            <span v-text="nowLangue.notificationDelivery"></span>
                        </el-menu-item>
                        <el-menu-item  index="DeliveryNoticeSheet" v-show="powerFlag.ROLE_security_deliveryNotification">
                            <i class="iconfont">&#xe60c;</i>
                            <!--送货通知-->
                            <span v-text="nowLangue.deliveryNotification"></span>
                        </el-menu-item>
                        <el-menu-item  index="PreInventorySheet" v-show="powerFlag.ROLE_security_preInventory">
                            <i class="iconfont">&#xe603;</i>
                            <!--预入库清单-->
                            <span v-text="nowLangue.preInventory"></span>
                        </el-menu-item>
                    </el-submenu>
                    <!-- 后续添加-->
                   <el-submenu index="6">
                        <template slot="title">
                            <i class="iconfont">&#xe608;</i>
                           <!-- &lt;!&ndash;库存设置&ndash;&gt;-->
                            <span v-text="nowLangue.inventoryConfig"></span>
                        </template>
                        <el-menu-item  index="StockIdentification">
                            <i class="iconfont">&#xe678;</i>
                            <!--&lt;!&ndash;库房标识&ndash;&gt;-->
                            <span v-text="nowLangue.stockIdentification"></span>
                        </el-menu-item>
                        <el-menu-item  index="StoreroomSetting">
                            <i class="iconfont">&#xe62b;</i>
                            <!--&lt;!&ndash;库房设置&ndash;&gt;-->
                            <span v-text="nowLangue.storeroomSetting"></span>
                        </el-menu-item>
                        <el-menu-item  index="ReservoirAttributes">
                            <i class="iconfont">&#xe665;</i>
                            <!--&lt;!&ndash;库区属性&ndash;&gt;-->
                            <span v-text="nowLangue.reservoirAttributes"></span>
                        </el-menu-item>
                        <el-menu-item  index="WarehouseArea">
                            <i class="iconfont">&#xe74f;</i>
                            <!--&lt;!&ndash;库房库区&ndash;&gt;-->
                            <span v-text="nowLangue.warehouseArea"></span>
                        </el-menu-item>
                        <el-menu-item  index="WarehousePosition">
                            <i class="iconfont">&#xe700;</i>
                          <!--  &lt;!&ndash;库房库位&ndash;&gt;-->
                            <span v-text="nowLangue.warehousePosition"></span>
                        </el-menu-item>
                        <el-menu-item  index="WarehouseOwnership">
                            <i class="iconfont">&#xe8a9;</i>
                           <!-- &lt;!&ndash;库房归属&ndash;&gt;-->
                            <span v-text="nowLangue.warehouseOwnership"></span>
                        </el-menu-item>
                        <el-menu-item  index="WarehousePersonnelAuthority">
                            <i class="iconfont">&#xe6f0;</i>
                          <!--  &lt;!&ndash;库房人员权限&ndash;&gt;-->
                            <span v-text="nowLangue.warehousePersonnelAuthority"></span>
                        </el-menu-item>
                    </el-submenu>
                    
                    <el-submenu index="7">
                        <template slot="title">
                            <i class="iconfont">&#xe75f;</i>
                            <!--工程管理-->
                            <span v-text="nowLangue.engineeringManagement"></span>
                        </template>
                        <el-menu-item  index="SpareParameterSetting">
                            <i class="iconfont">&#xe613;</i>
                            <!--备件参数设置-->
                            <span v-text="nowLangue.spareParameterSetting"></span>
                        </el-menu-item>
                        <el-menu-item  index="SpareParameterMaintenance">
                            <i class="iconfont">&#xe62f;</i>
                            <!--备件参数维护-->
                            <span v-text="nowLangue.spareParameterMaintenance"></span>
                        </el-menu-item>
                        <el-menu-item  index="EngineeringReplacement">
                            <el-badge :value="engineerReplaceNum" class="item"><!--工程替换数量-->
                                <i class="iconfont">&#xe660;</i>
                                <!--工程替换-->
                                <span v-text="nowLangue.engineeringReplacement"></span>
                            </el-badge>
                        </el-menu-item>
                        <el-menu-item  index="EReplacementConfirmation">
                            <i class="iconfont">&#xe625;</i>
                            <!--替换确认-->
                            <span v-text="nowLangue.eReplacementConfirmation"></span>
                        </el-menu-item>
                        <el-menu-item  index="EngineeringReplacementTeam">
                            <i class="iconfont">&#xe619;</i>
                            <!--工程替换组-->
                            <span v-text="nowLangue.engineeringReplacementTeam"></span>
                        </el-menu-item>
                        <el-menu-item  index="SupplyReplacementUnit">
                            <i class="iconfont">&#xe642;</i>
                            <!--供货替换组-->
                            <span v-text="nowLangue.supplyReplacementUnit"></span>
                        </el-menu-item>
                        <el-menu-item  index="barCodeCreate">
                            <i class="iconfont">&#xe615;</i>
                            <!--条码生成-->
                            <span v-text="nowLangue.barCodeCreate"></span>
                        </el-menu-item>
                        <el-menu-item  index="barCodeList">
                            <i class="iconfont">&#xe61f;</i>
                            <!--条码列表-->
                            <span v-text="nowLangue.barCodeList"></span>
                        </el-menu-item>
                        <el-menu-item  index="TestLend">
                            <i class="iconfont">&#xe615;</i>
                            <!--检验借出-->
                            <span v-text="nowLangue.TestLend"></span>
                        </el-menu-item>
                        <el-menu-item  index="TestLendReturn">
                            <i class="iconfont">&#xe615;</i>
                            <!--检验借出归还-->
                            <span v-text="nowLangue.TestLendReturn"></span>
                        </el-menu-item>
                        <el-menu-item  index="TestRecord">
                            <i class="iconfont">&#xe615;</i>
                            <!--检验记录-->
                            <span v-text="nowLangue.TestRecord"></span>
                        </el-menu-item>
                        <el-menu-item  index="SpareDOA">
                            <i class="iconfont">&#xe615;</i>
                            <!--备件DOA-->
                            <span v-text="nowLangue.SpareDOA"></span>
                        </el-menu-item>
                        <el-menu-item  index="SpareDOAdeal">
                            <i class="iconfont">&#xe615;</i>
                            <!--备件DOA查询-->
                            <span v-text="nowLangue.SpareDOAdeal"></span>
                        </el-menu-item>
                        <el-menu-item  index="AutoExam">
                            <i class="iconfont">&#xe615;</i>
                            <!--DOA自动审核-->
                            <span v-text="nowLangue.AutoExam"></span>
                        </el-menu-item>
                        <el-menu-item  index="RetestStep">
                            <i class="iconfont">&#xe615;</i>
                            <!--DOA复测步骤-->
                            <span v-text="nowLangue.RetestStep"></span>
                        </el-menu-item>
                        <el-menu-item  index="SpareQualityTestPlan">
                            <i class="iconfont">&#xe615;</i>
                            <!--备件质检计划-->
                            <span v-text="nowLangue.SpareQualityTestPlan"></span>
                        </el-menu-item>
                        <el-menu-item  index="ShortFailure">
                            <i class="iconfont">&#xe615;</i>
                            <!--短期失效标准-->
                            <span v-text="nowLangue.ShortFailure"></span>
                        </el-menu-item>
                        <el-menu-item  index="Fault">
                            <i class="iconfont">&#xe615;</i>
                            <!--故障-->
                            <span v-text="nowLangue.Fault"></span>
                        </el-menu-item>
                        <el-menu-item  index="NTFsampling">
                            <i class="iconfont">&#xe615;</i>
                            <!--NTF抽样-->
                            <span v-text="nowLangue.NTFsampling"></span>
                        </el-menu-item>
                        <el-menu-item  index="NonLossStandard">
                            <i class="iconfont">&#xe615;</i>
                            <!--非损标准-->
                            <span v-text="nowLangue.NonLossStandard"></span>
                        </el-menu-item>
                        <el-menu-item  index="NonLossRegister">
                            <i class="iconfont">&#xe615;</i>
                            <!--非损登记-->
                            <span v-text="nowLangue.NonLossRegister"></span>
                        </el-menu-item>
                        <el-menu-item  index="InspectionStandardSetting">
                            <i class="iconfont">&#xe615;</i>
                            <!--检验标准设置-->
                            <span v-text="nowLangue.InspectionStandardSetting"></span>
                        </el-menu-item>
                        <el-menu-item  index="InspectionLevelSetting">
                            <i class="iconfont">&#xe615;</i>
                            <!--检验水平设置-->
                            <span v-text="nowLangue.InspectionLevelSetting"></span>
                        </el-menu-item>
                        <el-menu-item  index="CheckAQLSettings">
                            <i class="iconfont">&#xe615;</i>
                            <!--检验水平设置-->
                            <span v-text="nowLangue.CheckAQLSettings"></span>
                        </el-menu-item>
                        <el-menu-item  index="TestReturn">
                            <i class="iconfont">&#xe615;</i>
                            <!--检验归还-->
                            <span v-text="nowLangue.TestReturn"></span>
                        </el-menu-item>
                        <el-menu-item  index="BatchQualityProblem">
                            <i class="iconfont">&#xe615;</i>
                            <!--批量质量问题-->
                            <span v-text="nowLangue.BatchQualityProblem"></span>
                        </el-menu-item>
                    </el-submenu>
                    <el-submenu index="8" v-show="powerFlag.ROLE_security_help">
                        <template slot="title">
                            <i class="iconfont">&#xe6ba;</i>
                            <!--帮助-->
                            <span v-text="nowLangue.help"></span>
                        </template>
                        <el-menu-item  index="TemplateDownload" v-show="powerFlag.ROLE_security_templateDownload">
                            <i class="iconfont">&#xe60f;</i>
                            <!--模板下载-->
                            <span v-text="nowLangue.templateDownload"></span>
                        </el-menu-item>
                    </el-submenu>
                    <el-menu-item index="9" v-show="powerFlag.ROLE_security_about">
                        <i class="iconfont">&#xe60d;</i>
                        <!--关于-->
                        <span v-text="nowLangue.about"></span>
                    </el-menu-item>
                </el-menu>
            </div>
            <!-- 右侧主内容区 -->
            <div  class="main-right fleft" >
                <router-view class="view"></router-view>
            </div>
        </main>
        <div class="footer clearfix">
            <div class="footer-inner fleft">
                2017 © PSCM by Lenovo.
            </div>
            <ul class="footer-tools fright">
                <li class="fleft" id="lang">
                    <span v-bind:class="selectedZH?'nav-lang active':'nav-lang'" @click="changeLanguage('zh',$event)">中文</span>
                    <span>/</span>
                    <span  v-bind:class="!selectedZH?'nav-lang active':'nav-lang'"  @click="changeLanguage('en',$event)">English</span>
                </li>
                <li class="go-top fleft" style="margin: 0 10px;">
                    <i class="iconfont">&#xe61b;</i>
                </li>
            </ul>
        </div>
    </div>

</template>

<script>
import Vue from 'vue'
export default  {
    data(){
        return {
            nowLangue:{},//当前语言包
            selectedZH:true,
            username:"",//登录人员
            defaultActive:"",
            //左侧菜单权限
            powerFlag:{},
            engineerReplaceNum:""//工程替换显示数量
        }
    },
    computed:{
        powerData(){
            return this.$store.state.powerData;
        },
        languageType(){
            return this.$store.state.languageType;
        },
        active(){
            this.urlName=window.location.hash.slice(2);
            var active=this.urlName;    // 当前活动菜单
            return active;
        }
    },
    watch:{
        languageType(){
            this.languageType=="zh"?this.nowLangue=this.language.zh:this.nowLangue=this.language.en;
            // this.languageType=="zh"? this.locale.use(this.zhCN):this.locale.use(this.en);
        },
        // '$store.state.currentActive': function () {
        //     // debugger
        //     var active=this.$store.state.currentActive;
        //     // if(active.indexOf("UpdateSpare")>=0){
        //     //     active="SpareFile";
        //     // }
        //     this.defaultActive=active;
        //     // console.log("this.defaultActive================================="+this.defaultActive);
        // },
        powerData(){
            setTimeout(function(){
                // 左侧菜单权限
                for(var i in this.powerData){
                    var key=this.powerData[i];
                    alert(key);
                    this.powerFlag[key]=true;
                }
            },0);            
        }
    },
    created:function(){
        var _this=this;
        this.languageType=="zh"?this.nowLangue=this.language.zh:this.nowLangue=this.language.en;
        this.selectedZH=this.languageType=="zh"?true:false;
        _this.isLogin();  //判断是否登录
        this.getEngineerReplaceNum();

        var hashStr=window.location.hash;
        var index=hashStr.lastIndexOf('?');
        var urlName;
        if(index<0){
            urlName=hashStr.slice(2);
        }else{
            urlName=hashStr.slice(2,index);
        }

        var active='';
        urlName==""?active='managementUnit':active=urlName;
        if(active.indexOf("UpdateSpare")>=0){
            active='SpareFile';
        }
        this.defaultActive=active;
    },
    mounted:function(){
        var _this=this;
        // 左侧菜单权限
        for(var i=0;i<_this.powerData.length;i++){
            var key=_this.powerData[i];
            _this.powerFlag[key]=true;
        }
        // 每隔五分钟检查一下是否为登录状态
        setInterval(function(){
            _this.isLogin();  //判断是否登录
        },300000);
        // // 页面渲染完成，显示当前选中菜单
        // this.$nextTick(function(){
        //     var active=this.$store.state.currentActive;
        //     // if(active.indexOf("UpdateSpare")>=0){
        //     //     active="SpareFile";
        //     // }
        //     this.defaultActive=active;
        // })


    },
    methods: {
        //判断是否登录
        isLogin(){
            var _this=this;
            $.ajax({
                // xhrFields: { withCredentials: true },
                type: 'GET',
                url: "http://127.0.0.1:18082/loginStatus",
                cache: false,
                success: function (data) {
                    console.log(data);
                    //alert(data);
                    if (data.success) {
                        if(data.data.loggedIn){
                            _this.$store.commit('grant', data.data.permissions);//加全局权限
                            _this.$store.commit('identity',data.data.staffType);// 当前登录人员的身份
                            _this.$nextTick(function(){
                                //赋权限
                                for(var i=0;i<data.data.permissions.length;i++){
                                    var key=data.data.permissions[i];
                                    _this.powerFlag[key]=true;
                                }
                                _this.username=data.data.username; 
                            })
                        }else{
                            _this.$router.push("/");
                        }
                    }else {
                        _this.common.errorTip(data.errorMessage);
                    }
                }
            });
        },
        Exit(){
            window.location.href="/rest-api/pscm-metadata/pscm-logout?successUrl="+location.origin;
        },
        //切换语言
        changeLanguage (type) {
            if(type=='en'){
                this.selectedZH=false;
            }else{
                this.selectedZH=true;
            }
            this.$store.commit('languageType', type);
        },
        //查询工程替换数量
        getEngineerReplaceNum(){
            var _this=this;
            $.ajax({
                type: 'GET',
                url: "http://127.0.0.1:18082/queryAllIncreasementMaterialCount",
                cache: false,
                success: function (data) {
                    if (data.success) {
                        _this.engineerReplaceNum=data.data;
                    }else {
                        _this.common.errorTip(data.errorMessage);
                    }
                }
            });
        }
    }
}

</script>